import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'
// 导入axios
import { getUserInfoAPI } from '@/api'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
	  token:'',//保存token字符串
	  userInfo:{}//保存用户信息
  },
  getters: {
     nickname: state => state.userInfo.nickname, // 昵称
     username: state => state.userInfo.username, // 用户名
     user_pic: state => state.userInfo.user_pic // 用户头像
  },
  mutations: {
    //保存token
	updateToken (state, newToken) {
	  state.token = newToken
	},
	//保存用户信息
	updateUserInfo(state,val){
		state.userInfo=val
	}
  },
  actions: {
	  //请求用户信息
    async getUserInfoActions(store){
	  const res=await getUserInfoAPI()
	  console.log(res)
	  store.commit('updateUserInfo',res.data.data)
	}
  },
  // 配置为 vuex 的插件
  plugins: [createPersistedState()]//注入持久化的插件
})
//vuex默认保存在内存中，所以刷新所有的值会回归初始化(无法做到持久存储)
//借助yarn add vuex-persistedstate@3.2.1这个包可以让vuex做到持久化存储
